<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core" 
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.prime.com.tr/ui">
<f:loadBundle basename="resources.mensaje" var="mensaje"/>
<h:head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />	
    <title><ui:insert name="title">#{mensaje['label.titulo']}</ui:insert></title>
    <link type="text/css" rel="stylesheet"
		href="#{request.contextPath}/css/default.css" />
	<link type="text/css" rel="stylesheet"
		href="#{request.contextPath}/themes/#{preferencias.tema}/skin.css" />
	<link type="text/css" rel="stylesheet"
		href="#{request.contextPath}/syntaxhighlighter/styles/syntaxhighlighter.css" />
</h:head>
<body background="/images/fondos/fondo2.jpg">
	<br />
	<br />
	<div align="center">
		<br />
		<table width="600" align="center" border="5"  cellspacing="5">
			<tr>
				<th>
				<ui:insert name="header">
		    	</ui:insert>
		    	</th>
			</tr>
			<tr>
				<td height="220">
					<h:form id="imageFondo" width="840" height="400" align="center">
						<p:imageSwitch effect="zoom" align="center">
							<ui:repeat value="#{imagenesBean.imagenes}" var="imagen">
								<p:graphicImage value="/images/autos/#{imagen}"
									style="width: 100%; height: 220px" />
							</ui:repeat>
						</p:imageSwitch>
					</h:form>
				</td>
			</tr>
			<tr>
				<td>
					<h:form id="themeForm">
						<div align="center"></div> 
						<div align="center">
							<h:panelGrid columns="5">
								<p:commandButton id="themeButton"
								value="Change Theme: #{preferencias.tema}"
								onclick="themeMenu.show()" type="button" style="width:100%" />
								
								<p:menu widgetVar="themeMenu" position="dynamic"
									context="'themeForm:themeButton','tl','bl'" styleClass="themeMenu">
									<p:submenu label="Themes">
										<p:menuitem value="Sam (Default)" ajax="false">
											<f:setPropertyActionListener value="sam"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Base" ajax="false">
											<f:setPropertyActionListener value="base"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Black-Tie" ajax="false">
											<f:setPropertyActionListener value="black-tie"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Blitzer" ajax="false">
											<f:setPropertyActionListener value="blitzer"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="BlueSky" ajax="false">
											<f:setPropertyActionListener value="bluesky"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Casablanca" ajax="false">
											<f:setPropertyActionListener value="casablanca"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Cupertino" ajax="false">
											<f:setPropertyActionListener value="cupertino"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Dark-Hive" ajax="false">
											<f:setPropertyActionListener value="dark-hive"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Dot-Luv" ajax="false">
											<f:setPropertyActionListener value="dot-luv"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Eggplant" ajax="false">
											<f:setPropertyActionListener value="eggplant"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Excite-Bike" ajax="false">
											<f:setPropertyActionListener value="excite-bike"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Flick" ajax="false">
											<f:setPropertyActionListener value="flick"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Hot-Sneaks" ajax="false">
											<f:setPropertyActionListener value="hot-sneaks"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Humanity" ajax="false">
											<f:setPropertyActionListener value="humanity"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Le-Frog" ajax="false">
											<f:setPropertyActionListener value="le-frog"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Mint-Choc" ajax="false">
											<f:setPropertyActionListener value="mint-choc"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Overcast" ajax="false">
											<f:setPropertyActionListener value="overcast"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Pepper-Grinder" ajax="false">
											<f:setPropertyActionListener value="pepper-grinder"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Redmond" ajax="false">
											<f:setPropertyActionListener value="redmond"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Smoothness" ajax="false">
											<f:setPropertyActionListener value="smoothness"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="South-Street" ajax="false">
											<f:setPropertyActionListener value="south-street"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Start" ajax="false">
											<f:setPropertyActionListener value="start"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Sunny" ajax="false">
											<f:setPropertyActionListener value="sunny"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Swanky-Purse" ajax="false">
											<f:setPropertyActionListener value="swanky-purse"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Trontastic" ajax="false">
											<f:setPropertyActionListener value="trontastic"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="UI-Lightness" ajax="false">
											<f:setPropertyActionListener value="ui-lightness"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="UI-Darkness" ajax="false">
											<f:setPropertyActionListener value="ui-darkness"
												target="#{preferencias.tema}" />
										</p:menuitem>
										<p:menuitem value="Vader" ajax="false">
											<f:setPropertyActionListener value="vader"
												target="#{preferencias.tema}" />
										</p:menuitem>
									</p:submenu>
								</p:menu>
								<h:outputText value="Idioma:" style="color: black" />
								<h:selectOneMenu value="#{idiomaBean.idioma}">
									<f:selectItem itemValue="Español" />
									<f:selectItem itemValue="Ingles" />
								</h:selectOneMenu>
								<h:commandButton value="Aceptar" action="#{idiomaBean.cambiarIdioma}"/>
							</h:panelGrid>
						</div>
					</h:form>
				</td>
			</tr>
			<tr>
				<td>
					<ui:insert name="content">
			  		</ui:insert>
		  		</td>
			</tr>
		</table>  	
	  	<br />
	  	<ui:insert name="footer">
		</ui:insert>
	</div>
</body>
</html>
